<template>
<div id="app">
  <el-card style="width: 1300px;margin: auto" >
    <el-page-header style="margin-top: 10px; margin-bottom: 10px" @back="goBack" content="医生信息"></el-page-header>
    <el-empty description="暂无医生" v-if="total === 0"></el-empty>
    <div v-else>
      <div style="margin-bottom: 20px">
        <span style="color: gray; font-size: 10px; ">找到 {{total}} 位医生</span>
      </div>

      <el-table :data="tableData" border stripe header-cell-class-name="headerBg">
<!--        <el-table-column prop="id" label="ID" width="80"></el-table-column>-->
        <el-table-column type="index"
          :index="this.indexStartNum"
          label="序号"
          width="100">
        </el-table-column>
        <el-table-column prop="photo" label="头像">
          <template slot-scope="scope">
            　<img :src="scope.row.photo" width="60" height="60" class="head_pic"/>
          </template>
        </el-table-column>
        <el-table-column prop="nickname" label="姓名"></el-table-column>
        <el-table-column prop="identity" label="身份"></el-table-column>
        <el-table-column prop="department.name" label="科室"></el-table-column>
        <el-table-column prop="hospital.name" label="医院" v-if="false"></el-table-column>
        <el-table-column prop="specialty" label="擅长" align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="num" label="问诊量"></el-table-column>
        <el-table-column prop="score" label="评分"></el-table-column>
        <el-table-column label="操作" width="180px">
          <template slot-scope="scope">
            <el-button type="primary" style="width: 100px" @click="handleOrder(scope.row)">挂号</el-button>
<!--            <el-button type="primary" @click="handleWen">问诊</el-button>-->
          </template>
        </el-table-column>
      </el-table>
    </div>

  </el-card>
</div>
</template>

<script>
export default {
  name: "Physician",
  data() {
    return {
      tableData: {},
      total: 0,
      indexStartNum: 1,
    }
  },
  created() {
    console.log(this.$route.query.hosId)
    console.log(this.$route.query.depId)
    this.load()
  },
  methods: {
    load() {
      this.request.get("/physician/findPhy", {
        params: {
          hosId: this.$route.query.hosId,
          depId: this.$route.query.depId,
        }
      }).then(res => {
        console.log(res)
        this.tableData = res.data
        this.total = res.total
      })
    },
    handleOrder(phy){
      this.$router.push({path: '/front/phyInfo', query: {physician: phy}})
    },
    handleWen(){
      this.$router.push("/front/im")
    },
    goBack() {
      this.$router.back()
    }
  }
}
</script>

<style scoped>
#app{
  padding-top: 20px;
  display:flex;
  justify-content: center;
  align-items: center;
}
</style>
